<template>
   <!-- <login v-on:showState="changeState" v-if="loginShow" :fromParent="fromParent"></login>-->
    <!--<div>-->
        <!--<child message="hello"></child>-->
    <!--</div>-->
    <!--<child v-bind:message="parentMsg" ></child>-->
    <div style="background-color: #EBEBEB;min-height:800px">

        <div style="margin-top:5px">
            <el-row :gutter="10">
                <el-col :xs="4" :sm="4" :md="4" :lg="4">
                    <div>
                        <el-menu default-active="1" class="el-menu-vertical-demo" style="min-height:800px"
                                 @select="handleSelect">
                            <el-menu-item index="1"><i class="el-icon-message"></i>导航一</el-menu-item>
                            <el-menu-item index="2"><i class="el-icon-menu"></i>导航二</el-menu-item>
                            <el-menu-item index="3"><i class="el-icon-setting"></i>导航三</el-menu-item>
                        </el-menu>
                    </div>
                </el-col>
                <el-col :xs="20" :sm="20" :md="20" :lg="20">
                    <div>
                        <div style="border: 1px solid #A6A6A6; border-radius:6px; padding:5px; margin:2px; background-color: white">
                            <el-breadcrumb separator="/">
                                <el-breadcrumb-item v-for="item in breadcrumbItems">{{item}}</el-breadcrumb-item>
                            </el-breadcrumb>
                        </div>
                    </div>
                    <div style="margin-top:10px">
                        <router-view></router-view>
                    </div>
                </el-col>
            </el-row>
        </div>
    </div>
</template>

<script>
    // import Child from "src/components/Child";
    export default {
        data() {
            return {
                searchCriteria: '',
                breadcrumbItems: ['导航一']
            }
        }, methods: {
            handleIconClick(ev) {
                console.log(ev);
            },
            handleSelect(key, keyPath) {
                switch (key) {
                    case '1':
                        this.$router.push('/Page1');
                        this.breadcrumbItems = ['导航一']
                        break;
                    case '2':
                        this.$router.push('/Page2')
                        this.breadcrumbItems = ['导航二']
                        break;
                    case '3':
                        this.$router.push('/Page3')
                        this.breadcrumbItems = ['导航三']
                        break;
                }
            },
        }
    }
</script>

<style scoped>

</style>